# Scene Engine 规格 v1.0

> 日期: 2026-07-06 | 阶段: Phase 3C
> 状态: SCENE_ENGINE_INIT

---

## 1. 什么是 Scene Engine

Scene Engine 是短视频工厂的**镜头生成引擎**。

它不是图片生成器，而是**镜头生成器**——它生成的不是单帧静态图，而是一段有进入、有动作、有退出、有时间轴的运动画面。

核心思想：**一帧好看不够，一段会动的画面才行。**

---

## 2. 核心原则

| 原则 | 说明 |
|------|------|
| **镜头优先** | 每个 scene 是一个镜头，不是一张图。必须有时序运动。 |
| **动画驱动** | 所有视觉内容通过动画呈现，不能静态停留超过 0.5 秒无动作。 |
| **时间线第一** | 每个 scene 以秒级时间线定义，精确到 0.1 秒。 |
| **65-75% 填充** | 主体内容必须占画面 65%-75%。 |
| **手机可读** | 最小字号 28px，关键信息 44px+。 |

---

## 3. Scene 结构定义

每个 scene 必须包含以下 10 个字段：

```yaml
scene_id:            # 唯一标识（snake_case）
duration:            # 时长（秒）
visual_goal:         # 视觉目标（一句话描述这个镜头要传达什么）
entry_motion:        # 进入动画（第一帧到稳定状态的动作）
main_motion:         # 主要动作（镜头的主体信息展示动画）
highlight_motion:    # 高亮时刻（最吸引眼球的视觉高潮）
exit_motion:         # 退出动画（离开或过渡到下一镜）
sound_cue:           # 音效提示（后续配音/音效参考）
subtitle_role:       # 字幕角色（这个镜头的字幕要说什么）
risk_guard:          # 风险防护（这个镜头容易出什么问题）
```

### 3.1 scene_id 规范

- 格式: `scene_{number}_{descriptive_name}`
- 例如: `scene_01_hook_error`, `scene_02_data_gate`
- 全小写 snake_case

### 3.2 duration 规范

- 最短 3 秒（信息极少时）
- 最长 12 秒（信息量大时）
- 标准 6-10 秒
- 45 秒 Pilot 约 5-7 个 scene

### 3.3 四段动画结构

每个 scene 必须包含四个运动阶段：

```
entry_motion     →  main_motion     →  highlight_motion     →  exit_motion
[0-15% time]        [15-75% time]      [75-90% time]           [90-100% time]
```

| 阶段 | 占比 | 说明 |
|------|:----:|------|
| entry_motion | 10-15% | 场景进入，背景/标题出现，奠定基调 |
| main_motion | 55-65% | 主体信息呈现，数据/字段/列表展示 |
| highlight_motion | 10-15% | 视觉高潮，关键结论/数字/状态突出 |
| exit_motion | 8-12% | 过渡/淡出/缩放，准备下一镜 |

---

## 4. 技术栈

### 4.1 主视觉引擎：HTML/CSS + Playwright

| 层 | 技术 | 职责 |
|:--:|:----:|------|
| 视觉设计 | HTML5 + CSS3 | 布局、样式、动画、字体 |
| 渲染引擎 | Playwright (Chromium) | 打开 HTML → 按帧截图 → 输出 PNG 序列 |
| 合成器 | FFmpeg | PNG 序列 → H.264 mp4 |
| 剪辑器 | FFmpeg | clip 拼接、音频合成 |

### 4.2 HTML/CSS 规范

- 画布: 1080×1920 (竖屏 9:16)
- 字体: 'Microsoft YaHei', sans-serif
- 背景: `#0a0a1a` (深空黑蓝)
- 面板: `#12122a` 半透明玻璃效果
- 动画: CSS `@keyframes` + `animation` 属性
- 动画时间控制: `animation-duration` + `animation-delay`
- 填充模式: `animation-fill-mode: both` (保持首尾状态)

### 4.3 渲染流程

```
HTML/CSS 模板
     ↓  Playwright 打开页面（动画自动播放）
     ↓  循环截图（15fps / 30fps）
PNG 帧序列
     ↓  FFmpeg image2pipe → libx264
H.264 mp4 (无音频)
     ↓  后续：clip 拼接 + 音频合成
成品视频
```

### 4.4 FFmpeg 职责范围

| 允许 | 禁止 |
|------|------|
| PNG 序列 → mp4 合成 | FFmpeg drawtext（复杂画面） |
| clip 拼接（concat） | FFmpeg 生成图形/UI |
| 音频叠加（amix） | FFmpeg 绘制进度条/背景 |
| 视频裁剪/缩放 | FFmpeg 制作标题文字 |
| 帧率转换 | FFmpeg 制作动画效果 |
| 接触表（contact sheet/tile） | — |

---

## 5. 视觉标准

### 5.1 色彩体系

| 用途 | 色值 | 场景 |
|------|------|------|
| 背景 | `#0a0a1a` | 全片基础 |
| 面板 | `#12122a` | 内容卡片 |
| 面板边框 | `#222244` | 卡片分隔 |
| 错误红 | `#FF4444` | 异常/警告/缺失 |
| 通过绿 | `#44FF44` | 成功/完成/通过 |
| 高亮金 | `#FFD700` | 重要数字/结论 |
| 科技蓝 | `#00BFFF` | 进度/信息/中性 |
| 文字色 | `#E0E0E0` | 正文信息 |
| 辅助色 | `#888888` | 次要/脚标 |

### 5.2 字体层级

| 层级 | 字号 | 字重 | 用途 |
|:----:|:----:|:----:|------|
| H1 | 76-96px | 900 | 关键数字/大标题 |
| H2 | 52-60px | 700 | 场景标题 |
| Body | 34-44px | 400 | 信息正文 |
| Table | 28-36px | 400 | 字段/列表文字 |
| Subtitle | 34-42px | 400 | 底部字幕 |
| Small | 18-22px | 300 | 阶段标记/来源 |

### 5.3 布局模板

```
┌──────────────────────┐
│  标题区 (10%)         │  ← Badge/阶段标识
├──────────────────────┤
│                      │
│  主视觉区 (72%)       │  ← 核心内容居中
│                      │
│                      │
├──────────────────────┤
│  结论区 (12%)         │  ← 总结/提示/结论
├──────────────────────┤
│  脚标 (6%)            │  ← 阶段标记 (小字)
└──────────────────────┘
```

---

## 6. 禁止事项

| 禁止 | 原因 |
|------|------|
| FFmpeg drawtext 做复杂画面 | 排版能力差，无法保证设计质量 |
| PIL debug UI | 结果像调试页面，缺乏专业感 |
| 静态图直接停留超过 0.5s | 不是镜头，是幻灯 |
| 空黑背景超过 20% | 视觉填充度不够 |
| 纯文字卡片 | 没有视觉层次，像 PPT |
| 循环填充 | 内容不够硬凑时长 |
| 主体只在左上角 | 竖屏必须居中/全屏分布 |

---

## 7. 输出规范

| 产物 | 格式 | 规格 |
|------|------|------|
| 源文件 | HTML | 1080×1920, CSS @keyframes |
| 帧序列 | PNG | 15fps, 无损 |
| Scene Clip | MP4 | H.264, 1080×1920, 无音频 |
| Contact Sheet | JPG | 6×6 关键帧缩略图 |

---

## 8. 后续阶段

| 阶段 | 目标 | 入口条件 |
|:----:|------|:--------:|
| Phase 3C (当前) | Scene Engine 验证（3 个动态镜头） | Phase 3B 参考帧通过审核 |
| Phase 4A | 45s Pilot（7-8 个 scene 全流程） | Scene Engine 验证通过 |
| Phase 4B | 长片试制（37 镜头全片） | Pilot 验证通过 |
| Phase 5 | 生产就绪 + 自动化 | 全片验证通过 |